import React, { useState, useEffect } from 'react'
import { Button, View, Image } from '@tarojs/components'
import { useRequest } from 'ahooks'
import { request, baseURL } from '../../utils/request'
import Taro from '@tarojs/taro'
import styles from './index.module.less'
import { getCurrentInstance } from '@tarojs/taro'
const getGood = (id: number) => {
  return request('get', '/app/goodsInfo', { id })
}

const delGood = (id: number) => {
  return request('delete', '/app/mygoods?id=' + id, {})
}
const value = ['商品', '求购', '失物招领']
const UsedDetail: React.FC<{}> = ({ }) => {
  // @ts-ignore
  const { id, has_delete } = getCurrentInstance().router.params
  const [data, setData] = useState({})
  const getData = useRequest(getGood, {
    manual: true,
    onSuccess: i => {
      // @ts-ignore
      setData(i)
    }
  })
  const deleteData = useRequest(delGood, {
    manual: true,
    onSuccess: i => {
      if (i) return
      Taro.navigateBack()
    }
  })
  useEffect(() => {
    // @ts-ignore
    getData.run(id)
  }, [])

  return (
    <View className={styles.detail}>
      <View className='at-article'>
        <View className='at-article__h1'>
          {/*  @ts-ignore */}
          {data.content}
        </View>
        <View className='at-article__info'>
          {/*  @ts-ignore */}
          {data.createTime}&nbsp;&nbsp;&nbsp;{value[data.type]}
        </View>
        {
          // @ts-ignore
          data.picture && <View className='at-article__content'>
            <View className='at-article__section'>
              <Image
                className='at-article__img'
                // @ts-ignore
                src={`${baseURL}${data.picture}`}
                mode='widthFix' />
            </View>
          </View>
        }
      </View>
      {has_delete === 'true' && <Button onClick={() => deleteData.run(Number(id))} style={{ marginTop: '15PX' }} type="warn">删 除</Button>}
    </View>
  )
}

export default UsedDetail